<template>
  <page-layout :title="title">
    <a-card :bordered="false">
      <detail-list title="患者基础情况" >
        <detail-list-item term="科别" v-if="Detail">{{ Detail.dept }}</detail-list-item>
        <detail-list-item term="主管医生" v-if="Detail">{{ Detail.doc }}</detail-list-item>
        <detail-list-item term="主刀医生" v-if="Detail">{{ Detail.chiefSurgeon }}</detail-list-item>
        <detail-list-item term="病例号" v-if="Detail">{{ Detail.outpatientid }}</detail-list-item>
        <detail-list-item term="年龄" v-if="Detail">{{ Detail.age }}</detail-list-item>
        <detail-list-item term="体重" v-if="Detail">{{ Detail.weight }}</detail-list-item>
        <detail-list-item term="性别" v-if="Detail">{{ Detail.sex === '1' ? '男' : '女' }}</detail-list-item>
        <detail-list-item term="出入院时间" v-if="Detail">{{ Detail.inTime}}--{{ Detail.outTime}}</detail-list-item>
        <detail-list-item term="出院诊断" v-if="Detail">{{ Detail.diagnosis}}</detail-list-item>
      </detail-list>
      <a-divider style="margin-bottom: 32px"/>
      <detail-list title="手术情况">
        <detail-list-item term="手术名称" v-if="Detail">{{ Detail.operation }}</detail-list-item>
        <detail-list-item term="手术日期" v-if="Detail">{{ Detail.operationDate }}</detail-list-item>
        <detail-list-item term="切口类型" v-if="Detail">{{ Detail.incisionType }}</detail-list-item>
        <detail-list-item term="切口愈合" v-if="Detail">{{ Detail.incisionHeal }}</detail-list-item>
        <detail-list-item term="手术开始时间" v-if="Detail">{{ Detail.startTime }}</detail-list-item>
        <detail-list-item term="手术结束时间" v-if="Detail">{{ Detail.endTime }}</detail-list-item>
        <detail-list-item term="手术持续时间" v-if="Detail">{{ Detail.duration}}</detail-list-item>
        <detail-list-item term="术前用药时机" v-if="Detail">{{ Detail.opportunity}}</detail-list-item>
        <detail-list-item term="术中追加" v-if="Detail">{{ Detail.add ? '是' : '否'}}</detail-list-item>
      </detail-list>
      <a-divider style="margin-bottom: 32px"/>

      <div class="title">用药情况</div>
      <a-table
        style="margin-bottom: 24px" 
        :columns="goodsColumns" 
        :dataSource="loadGoodsData"
        :pagination="false">
      </a-table>
    </a-card>

    <a-card
      style="width:100%"
      :bordered="false"
      :tabList="tabListNoTitle"
      :activeTabKey="noTitleKey"
      @tabChange="key => handleTabChange(key, 'noTitleKey')"
    >
      <article-page v-if="noTitleKey === '1'"></article-page>
      <app-page v-else-if="noTitleKey === '2'"></app-page>
      <project-page v-else-if="noTitleKey === '3'"></project-page>
    </a-card>

  </page-layout>
</template>

<script>
  import PageLayout from '@/components/page/PageLayout'
  import STable from '@/components/table/'
  import { getAction1, postActionparams1,postActionparams2, getAction2, getAction, postAction } from '@/api/manage'
  import DetailList from '@/components/tools/DetailList'
  import ABadge from "ant-design-vue/es/badge/Badge"
  import { AppPage, ArticlePage, ProjectPage } from './page'
  const DetailListItem = DetailList.Item

  export default {
    components: {
      PageLayout,
      ABadge,
      DetailList,
      DetailListItem,
      STable,
      AppPage,
      ArticlePage,
      ProjectPage
    },
    data () {

      return {
        Detail:{},
        statusWords:'',
        loadGoodsData:[],
        noTitleKey: '1',
        tabListNoTitle: [
          {
            key: '1',
            tab: '初评'
          },
          {
            key: '2',
            tab: '科室内评审'
          },
          {
            key: '3',
            tab: '点评会'
          }
        ],
        goodsColumns: [
          {
            title: '通用名',
            dataIndex: 'drug',
            key: 'drug'
          },
          {
            title: '途径',
            dataIndex: 'route',
            key: 'route'
          },
          {
            title: '剂量',
            dataIndex: 'dosage',
            key: 'dosage',
          },
          {
            title: '溶媒',
            dataIndex: 'menstruum',
            key: 'menstruum',
          },
          {
            title: '频次',
            dataIndex: 'frequency',
            key: 'frequency'
          },
          {
            title: '用药目的',
            dataIndex: 'objective',
            key: 'objective',
          },
        ],
      }
    },
    filters: {
      statusFilter(status) {
        const statusMap = {
          'processing': '进行中',
          'success': '完成',
          'failed': '失败'
        }
        return statusMap[status]
      }
    },
    computed: {
      title () {
        return this.$route.meta.title
      }
    },
    mounted() {
      this.getDetail();
    },
    methods: {
      getDetail() {
        let that = this
        var param = {
          // pageNo: that.ipagination.current,
          // pageSize: that.ipagination.pageSize,
        }
        postActionparams2('/perioperative/getDetail', param)
          .then((res) => {
            if (res.code == 0) {
              that.Detail = res.result

              that.loadGoodsData = this.getDruglist(res.result.druglist)
              that.Detail.incisionHeal = this.getIncisionHeal()
              that.Detail.incisionType = this.getIncisionType()
              that.Detail.opportunity = this.getOpportunity()
            }
          })
      },
      getDruglist(list) {
        var newlist =[]
        for(let item of list ){
          if (item.objective == '0') {
            item.objective = '预防'
          }
          if (item.objective  == '1') {
            item.objective = '治疗'
          }
          if (item.objective  == '2') {
            item.objective = '预+治'
          }
          if (item.objective  == '3') {
            item.objective = '无指证'
          }
          newlist.push(item)
        }

        return newlist
      },

      getOpportunity() {
        if (this.Detail.opportunity == '0') {
          return '<30min'
        }
        if (this.Detail.opportunity  == '1') {
          return '30min≤and≤1h'
        }
        if (this.Detail.opportunity  == '2') {
          return '>1h'
        }
        if (this.Detail.opportunity  == '3') {
          return '未用'
        }
        return ''
      },
      getIncisionType() {
        if (this.Detail.incisionType == '0') {
          return 'I'
        }
        if (this.Detail.incisionType  == '1') {
          return 'II'
        }
        if (this.Detail.incisionType  == '2') {
          return 'III'
        }
        return ''
      },
      getIncisionHeal() {
        if (this.Detail.incisionHeal == '0') {
          return '甲'
        }
        if (this.Detail.incisionHeal  == '1') {
          return '乙'
        }
        if (this.Detail.incisionHeal  == '2') {
          return '丙'
        }
        return ''
      },
      handleTabChange (key, type) {
        this[type] = key
      },
    },
  }
</script>

<style lang="less" scoped>
  .title {
    color: rgba(0,0,0,.85);
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 16px;
  }
</style>